<template>
  <a-space direction="vertical" :style="{ width: '100%' }">
    <a-upload
      draggable
      :custom-request="customRequest"
      :fileList="file ? [file] : []"
      :show-file-list="false"
      @change="onChange"
    />
  </a-space>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import { uploadUsingPost } from '@/service/backend/fileInfoController';
import { Message } from '@arco-design/web-vue';

const emit = defineEmits(['update:modelValue']);

const file = ref();

const onChange = (_, currentFile) => {
  file.value = {
    ...currentFile
  };
};

const customRequest = async option => {
  try {
    const res = await uploadUsingPost({}, option.fileItem.file);
    if (res.data && res.code === 0) {
      emit('update:modelValue', res.data);
      Message.success(`${option.fileItem.name}上传成功`);
    }
  } catch (e) {
    Message.error('文件上传失败,' + e.message);
  }
};
</script>
